<style>
    /*头像圆角形样式*/
    .sex_0{
        background:#efefef;text-align: center;
        border-radius:10px;
        padding:10px 5px;
    }
    .sex_00{
        background:#efefef;text-align: center;
        border-radius:10px;
        padding:5px;
    }
    .headerBG_-1{background:#666666;}
    .headerBG_0{background:#e6a23c;}
    /*顶部tab样式*/
    /*全部*/
    .tabGB0{
        background:#e6a23c;color:#FFF;padding:10px;
    }
    /*急需回访，陌客*/
    .tabGB1{
        background:#e6a23c;color:#FFF;padding:10px;
    }
    /*转化中*/
    .tabGB2{
        background:#85ce61;color:#FFF;padding:10px;
    }
    /*已成交*/
    .tabGB3{
        background:#FF0000;color:#FFF;padding:10px;
    }
    /*已删除*/
    .tabGB4{
        background:#666;color:#FFF;padding:10px;
    }
    #ztBtnBox .el-button{padding:5px 10px !important;}
    #beizhu .el-form-item__content{width:100% !important;}
    .el-checkbox__input{border:2px solid #999 !important;}
    #showStart .el-rate__item{width:15px !important;}
    .upload-demo input{display:none;}
</style>
<div style="padding:20px;">
    <div id="dituiuser" v-cloak>
        <div style="background:#FFF;padding-top:20px;margin-bottom:10px;padding-left:10px;display:flex;">
            <div style="flex:1;">
                <el-form ref="aaa" :inline="true" :model="formInline" class="demo-form-inline">
                    <div>
                        <el-form-item>
                            <el-button type="success" @click="search('today')">今天</el-button>
                            <el-button type="warning" @click="search('yesterday')">昨天</el-button>
                        </el-form-item>

                        <el-form-item label="" style="width:120px;">
                            <el-select v-model="formInline.sellerId" filterable placeholder="选择采单员">
                                <el-option key="0" label="手动添加的" value="0"></el-option>
                                <el-option
                                        v-for="item in sellerArr"
                                        :key="item.ds_userid"
                                        :label="item.ds_truename"
                                        :value="item.ds_userid">
                                </el-option>
                            </el-select>
                        </el-form-item>

                        <el-form-item label="" >
                            <el-date-picker style="width:170px;"
                                    v-model="formInline.startTime"
                                    type="datetime"
                                    placeholder="选择开始日期"
                                    format="yyyy-MM-dd HH:mm:ss"
                                    value-format="yyyy-MM-dd HH:mm:ss">
                            </el-date-picker>
                        </el-form-item>
                        <el-form-item label="">
                            <el-date-picker  style="width:170px;"
                                    v-model="formInline.endTime"
                                    type="datetime"
                                    placeholder="选择结束日期"
                                    format="yyyy-MM-dd HH:mm:ss"
                                    value-format="yyyy-MM-dd HH:mm:ss">
                            </el-date-picker>
                        </el-form-item>

                        <el-form-item style="width:125px;">
                            <el-select v-model="formInline.flowint" filterable placeholder="选择流程">
                                <el-option key="all" label="全部" value="all" ></el-option>
                                <el-option key="back" label="急需回访" value="back" ></el-option>
                                <el-option key="0" label="陌客" value="0" ></el-option>
                                <el-option
                                        v-for="(item, index) in zhuanghuaArr"
                                        :key="String(index+1)"
                                        :label="item"
                                        :value="String(index+1)">
                                </el-option>
                                <el-option key="80" label="已成交" value="80" ></el-option>
                                <el-option key="-1" label="回收站" value="-1" ></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item v-if="showMyData > 10" label="" style="width:150px;">
                            <el-select v-model="formInline.sayadminId" filterable placeholder="选择沟通员">
                                <el-option label="全部沟通员" value=""></el-option>
                                <el-option key="0" label="未分配" value="0"></el-option>
                                <el-option
                                        v-for="item in adminArr"
                                        :key="item.store_user_id"
                                        :label="item.real_name"
                                        :value="item.store_user_id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item v-if="showMyData > 10" label="" style="width:135px;">
                            <el-select v-model="formInline.channelStr" filterable placeholder="渠道来源">
                                <el-option label="全部渠道" value=""></el-option>
                                <el-option label="地推" value="地推"></el-option>
                                <el-option label="口碑" value="口碑"></el-option>
                                <el-option label="转介绍" value="转介绍"></el-option>
                                <el-option label="自主上门" value="自主上门"></el-option>
                                <el-option label="陌生电话" value="陌生电话"></el-option>
                                <el-option label="扫码进线" value="扫码进线"></el-option>
                                <el-option label="批量导入" value="批量导入"></el-option>
                            </el-select>
                        </el-form-item>
                    </div>
                    <div>
                        <el-form-item label="" style="width:120px;">
                            <el-input v-model="formInline.name" placeholder="姓名"></el-input>
                        </el-form-item>
                        <el-form-item label="" style="width:150px;">
                            <el-input v-model="formInline.school" placeholder="学校"></el-input>
                        </el-form-item>
                        <el-form-item label="" style="width:120px;">
                            <el-input v-model="formInline.phone" placeholder="手机号" maxlength="11"></el-input>
                        </el-form-item>
                        <el-form-item label="">
                            <el-input v-model="formInline.remark" placeholder="备注"></el-input>
                        </el-form-item>
                        <el-form-item label="" style="width:120px;">
                            <el-select v-model="formInline.sex" placeholder="性别">
                                <el-option label="未填写" value="0"></el-option>
                                <el-option label="男生" value="1"></el-option>
                                <el-option label="女生" value="2"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="" style="width:120px;">
                            <el-input v-model="formInline.xuehao" placeholder="学号 / ID号"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="search('yes')">查询</el-button>
                            <el-button type="danger" icon="el-icon-search" style="background:#FF0000" @click="search('no')">全部查找</el-button>
                        </el-form-item>
                    </div>
                </el-form>
            </div>
            <div style="width:200px;text-align: right;padding-right:10px;">
                <div>
                    <el-button type="danger" @click="openAddUserBox('add', '手动添加陌客')">手动添加陌客</el-button>
                </div>
                <div style="padding-top:20px;">
                    <el-upload
                            class="upload-demo"
                            action="/index.php?s=/store/ditui.dtzhuanhua/piliAddmoke"
                            :multiple="false"
                            :show-file-list="false"
                            accept=".csv"
                            :before-upload="beforeUpload"
                            :on-success="chooceFileOk"
                            :file-list="fileList">
                        <el-button size="small" type="primary">点击上传</el-button>
                    </el-upload>
                </div>
                <div style="padding-top:5px;font-size:13px;"><a href="/myscript/pldr_moke.CSV" target="_blank">下载批量导入陌客模板</a></div>
            </div>
        </div>

        <div style="background:#FFF;padding-bottom:0;padding-top:20px;padding-left:10px;padding-right:10px;margin-bottom:5px;">
            <el-tabs id="tabBox" type="card" v-model="activeName" @tab-click="handleClick" :stretch="true">
                <el-tab-pane name="tab_all">
                    <span slot="label" :class="activeName=='tab_all' ? 'tabGB0' : ''"><i class="el-icon-user"></i>全部 ({{allBigNumArr['allNum_all']}})</span>
                </el-tab-pane>
                <el-tab-pane name="tab_back">
                    <span slot="label" :class="activeName=='tab_back' ? 'tabGB1' : ''"><i class="el-icon-bell"></i> 急需回访
                        <span :style="activeName=='tab_back' ? 'tabGB1' : 'color:#FF00FF;font-weight:bold;font-size:18px;'"> ({{allBigNumArr['allNum_back']}})</span>
                    </span>
                </el-tab-pane>
                <el-tab-pane name="tab_0">
                    <span slot="label" :class="activeName=='tab_0' ? 'tabGB1' : ''"><i class="el-icon-mobile-phone"></i>陌客 ({{allBigNumArr['allNum_0']}})</span>
                </el-tab-pane>
                <el-tab-pane :name="'tab_'+(index+1)" v-for="(item, index) in zhuanghuaArr">
                    <span slot="label"
                          :class="activeName=='tab_'+(index+1) ? 'tabGB2' : ''"
                          :style="activeName=='tab_'+(index+1) ? 'background:'+zhColorArr[index] : ''"
                    >
                        <i class="el-icon-s-tools"></i>
                        <span>{{item}} ({{allBigNumArr['allNum_'+(index+1)]}})</span>
                    </span>
                </el-tab-pane>

                <el-tab-pane name="tab_80">
                    <span slot="label" :class="activeName=='tab_80' ? 'tabGB3' : ''"><i class="el-icon-s-flag"></i>已成交 ({{allBigNumArr['allNum_80']}})</span>
                </el-tab-pane>

                <el-tab-pane name="tab_del">
                    <span slot="label" :class="activeName=='tab_del' ? 'tabGB4' : ''"><i class="el-icon-delete"></i>回收站 ({{allBigNumArr['allNum_-1']}})</span>
                </el-tab-pane>
            </el-tabs>
        </div>

        <el-empty v-if="tableData.length==0" description="该状态下无数据"></el-empty>
        <el-table v-else-if="tabelYS=='one'" border stripe size="mini" ref="multipleTable" tooltip-effect="dark" :data="tableData" @selection-change="handleSelectionChange" style="width: 100%">
            <el-table-column type="selection" width="45" header-align="center"></el-table-column>
            <el-table-column label="进线 / 采集人" width="100" header-align="center">
                <template slot-scope="scope">
                    <div @click="openModify('modify', '修改信息', scope.$index, scope.row)" style="cursor: pointer;">
                    <div style="padding:0;line-height:15px;text-align:center;"><span style="color:#f3f;font-weight:bold;font-size:18px;" v-html="getShortTime(scope.row.dl_addtime,3)">{{scope.row.dl_addtime}}</span></div>
                    <div style="padding:0;line-height:15px;color:#666;font-weight:bold;text-align:center;">
                        <span style="font-size:11px;">{{scope.row.dl_dituiname}}</span>
<!--                        <span v-if="scope.row.dl_userid>0">ID:{{scope.row.dl_userid}}</span>-->
                    </div>
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="状态" width="100" header-align="center">
                <template slot-scope="scope">
                    <div id="ztBtnBox" style="text-align:center;" @click="openFlowChange(scope.$index, scope.row, 'move')">
                        <span v-if="scope.row.du_flowid==0"><el-button type="warning" size="small" style="background:#FFF;color:#e6a23c;border:1px solid #e6a23c;">陌 客 ▼</el-button></span>
                        <span v-for="(item, index) in zhuanghuaArr">
                            <span v-if="scope.row.du_flowid==(index+1)">
                                <el-button :style="scope.row.du_flowid==(index+1) ? getHeaderBg(scope.row.du_flowid, 2) : ''"
                                           type="success" size="small">{{item}} ▼</el-button>
                            </span>
                        </span>
                        <span v-if="scope.row.du_flowid==80"><el-button type="danger" size="small" style="background:#FFF;color:#F00;border:1px solid #F00;">已成交</el-button></span>
                        <span v-if="scope.row.du_flowid==-1"><el-button type="info" size="small" style="background:#FFF;color:#666;border:1px solid #666;">回收站 ▼</el-button></span>
                    </div>
                    <div style="line-height:15px;font-weight:bold;text-align:center;color:#F00;" v-if="scope.row.du_class==-1">（退 费 中）</div>
                    <div style="line-height:15px;font-weight:bold;text-align:center;color:#00F;" v-if="scope.row.du_class==-4">（已 退 费）</div>
                </template>
            </el-table-column>
            <el-table-column label="姓名" width="95" header-align="center">
                <template slot-scope="scope">
                    <div @click="openModify('modify', '修改信息', scope.$index, scope.row)" style="cursor:pointer;text-align:center;">
                        <span style="font-weight:bold;color:#000;font-size:14px;">{{scope.row.du_truename}}</span>
                        <!--<span>（{{scope.row.du_age}}岁）</span>-->
                        <el-badge style="margin-top:10px;" :value="getSexStr(scope.row.du_sex)" class="item" :type="getSexBtnType(scope.row.du_sex)">
                            <span>&nbsp;&nbsp;</span>
                        </el-badge>
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="电话" width="110" header-align="center">
                <template slot-scope="scope">
                    <div @click="openModify('modify', '修改信息', scope.$index, scope.row)" style="cursor:pointer;">
                        <div>
                            <span style="color:#666;font-weight:bold;font-size:14px;">{{scope.row.du_mobile}}</span>
                        </div>
                        <div id="showStart" v-if="scope.row.dl_dafen>0">
                            <el-rate v-model="scope.row.dl_dafen" disabled ></el-rate>
                        </div>
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="学校" width="130" header-align="center">
                <template slot-scope="scope">
                    <div style="padding:0;line-height:15px;cursor:pointer;text-align: center;">
                        <span @click="openModify('modify', '修改信息', scope.$index, scope.row)">{{scope.row.du_school}}</span>
<!--                        <span @click="openModify('modify', '修改信息', scope.$index, scope.row)">-->
<!--                            <el-button :style="getHeaderBg(scope.row.du_flowid, 2)" type="success" icon="el-icon-edit" circle size="mini"></el-button>-->
<!--                        </span>-->
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="年级 / 积分" width="90" header-align="center">
                <template slot-scope="scope">
                    <div @click="openModify('modify', '修改信息', scope.$index, scope.row)" style="cursor:pointer;text-align: center;">
                        <div style="padding:0;line-height:15px;"><span style="color:#666;">{{scope.row.du_grade}}</span></div>
                        <div style="padding:0;line-height:20px;color:#999;" v-if="scope.row.points>0">积分：{{scope.row.points}}</div>
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="头像" width="60" header-align="center">
                <template slot-scope="scope">
                    <div @click="openModify('modify', '修改信息', scope.$index, scope.row)" style="text-align: center;cursor: pointer;">
                        <el-avatar size="medium" :src="scope.row.avatarUrl"></el-avatar>
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="微信昵称" width="130" header-align="center">
                <template slot-scope="scope">
                    <div style="line-height:15px;cursor: pointer;" @click="openModify('modify', '修改信息', scope.$index, scope.row)">
                        <div style="padding:5px 0;text-align:center;line-height:10px;">
<!--                            <span>{{scope.row.dl_dituiname}}</span>-->
                            <span v-if="scope.row.dl_userid>0">学号:{{scope.row.dl_userid}}</span>
                        </div>
                        <div style="padding:0;line-height:20px;color:#999;text-align:center;line-height:12px;" v-if="scope.row.nickName!='微信用户'">{{scope.row.nickName}}</div>
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="沟通员" width="70" header-align="center">
                <template slot-scope="scope">
                    <div @click="openFlowChange(scope.$index, scope.row, 'fenpei')" style="text-align: center;cursor: pointer;">
                        <div style="line-height:15px;" v-if="scope.row.du_sayname!=null"><span style="color:#0033ff;">{{scope.row.du_sayname}}</span></div>
                        <div style="line-height:15px;" v-else><span style="color:#333;">未分配</span></div>
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="试听时间" width="120" header-align="center">
                <template slot-scope="scope">
                    <div id="ztBtnBox" @click="openShitingBox(scope.$index, scope.row)" style="text-align:center;">
                        <div v-if="scope.row.du_shiting!=null">
                            <el-button :style="getHeaderBg(scope.row.du_flowid, 2)" type="warning" icon="el-icon-user-solid" size="small">
                                <span></span><span v-html="getShortTime(scope.row.du_shiting,2)"></span>
                            </el-button>
                        </div>
                        <div v-else>
                            <span style="color:#888;cursor: pointer;">设置上门试听</span>
                        </div>
                        <div style="font-size:11px;" v-if="scope.row.dl_channel!=null">渠道：<span style="color:#00f;">{{scope.row.dl_channel}}</span></div>
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="设置回访" width="120" header-align="center">
                <template slot-scope="scope">
                    <div id="ztBtnBox" @click="openCallBackBox(scope.$index, scope.row)" style="text-align:center;">
                        <div style="text-align:left;" v-if="scope.row.du_nextcall!=null">
                            <span>
                                <el-button :style="getHeaderBg(scope.row.du_flowid, 2)" type="warning" icon="el-icon-phone" size="small">
                                    <span></span><span v-html="getShortTime(scope.row.du_nextcall,2)"></span>
                                </el-button>
                            </span>
                        </div>
                        <div v-else>
                            <span style="color:#888;cursor: pointer;">设置回访时间</span>
                        </div>
                        <div style="font-size:11px;" v-if="scope.row.du_dingjin>0">定金：<span style="color:#f00;font-weight:bold;">¥{{scope.row.du_dingjin}}</span></div>
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="沟通情况备注" header-align="center">
                <template slot-scope="scope">
                    <div style="display:flex;">
<!--                        <div style="width:35px;">-->
<!--                            <span @click="openTheLogBox(scope.$index, scope.row)">-->
<!--                                <el-button :style="getHeaderBg(scope.row.du_flowid, 2)" type="success" icon="el-icon-edit-outline" circle size="mini"></el-button>-->
<!--                            </span>-->
<!--                        </div>-->
<!--                        <div style="flex:1;">-->
<!--                            <el-input type="textarea" :rows="3" v-model="scope.row.du_zhmyremark" :readonly="true"></el-input>-->
<!--                        </div>-->
                        <div style="flex:1;cursor: pointer;" @click="openTheLogBox(scope.$index, scope.row)">
                            <div v-if="scope.row.zhmarkArr.length>0" style="width:100%;height:43px;overflow-y:hidden;">
                                <div v-for="(item, index) in scope.row.zhmarkArr">
                                    <div style="display:flex;">
                                    <div style="flex-basis: auto;">
                                        <span>{{item.no}}：</span>
                                    </div>
                                        <div style="flex-basis: auto;">{{item.cl_adminname}}</div>
                                        <div style="flex-basis: auto;color:#00F;">【{{item.cl_typestr}}】</div>
                                        <div style="flex-basis: auto;color:#333;font-weight:bold;" v-html="getShortTime(item.cl_addtime,2)"></div>
<!--                                        <div style="flex:1;text-align:right;font-weight:bold;" v-html="getShortTime(item.cl_addtime,2)"></div>-->
                                    </div>
                                    <div style="padding-left:0px;font-weight:bold;color:#888;">{{item.cl_logtxt}}</div>
                                </div>
                            </div>
                            <div v-else style="text-align: center;height:43px;">
                                <span @click="openTheLogBox(scope.$index, scope.row)">
                                    <el-button :style="getHeaderBg(scope.row.du_flowid, 2)" type="success" icon="el-icon-edit-outline" circle size="mini"></el-button>
                                </span>
                            </div>
                        </div>
                    </div>
                </template>
            </el-table-column>
        </el-table>

        <div style="background:#FFF;padding:20px 0;margin-top:0px;display: flex;">
            <div style="width:400px;padding-left:20px;">
                <el-button v-if="activeName!='tab_80'" type="primary" size="mini" @click="pimoveInit('move')">批量移动</el-button>
                <el-button type="success" size="mini" @click="pibackCall">批量设置回访</el-button>
                <el-button v-if="activeName!='tab_80' && showMyData>20" type="primary" size="mini" @click="pimoveInit('fenpei')">批量分配给沟通员</el-button>
            </div>
            <div style="flex:1;text-align:right;">
                <el-pagination
                        background
                        layout="total, prev, pager, next"
                        :total="totalItems"
                        :page-size="pageSize"
                        @current-change="handleCurrentChange"
                        :current-page.sync="currentPage">
                </el-pagination>
            </div>
        </div>

        <el-dialog :title="modifyTitle" :visible.sync="addMokeDivShow" :close-on-click-modal="false" :close-on-press-escape="false" width="30%">
            <el-form :model="personObj" :rules="rules" ref="personObj" label-width="120px" class="demo-ruleForm">
                <el-form-item label="手机1：" prop="mmphone">
                    <div style="display:flex;">
                        <div style="flex:1;">
                            <div>
                                <el-input maxlength="11" v-model="personObj.mmphone" :disabled="userModifyKey=='add' ? false : true" placeholder="请输入陌客手机号" maxlength="11" autocomplete="off"></el-input>
                            </div>
                            <div style="display:flex;">
                                <div style="width:80px;color:#F00;font-weight:bold;" v-if="personObj.points>0">积分:{{personObj.points}}</div>
                                <div style="flex:1;text-align:right;" v-if="personObj.nickName!=null && personObj.nickName!=''">{{personObj.nickName}}</div>
                            </div>
                        </div>
                        <div v-if="personObj.avatarUrl!=null && personObj.avatarUrl!=''" style="width:100px;text-align:right;">
                            <img :src="personObj.avatarUrl" style="width:80px;height:80px;border-radius:50%;" />
                        </div>
                    </div>
                </el-form-item>
                <el-form-item label="姓名：">
                    <el-input v-model="personObj.mokeName" placeholder="请输入姓名（可不填）" maxlength="12" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="渠道：">
                    <el-select v-model="personObj.dl_channel">
                        <el-option label="地推" value="地推"></el-option>
                        <el-option label="口碑" value="口碑"></el-option>
                        <el-option label="转介绍" value="转介绍"></el-option>
                        <el-option label="自主上门" value="自主上门"></el-option>
                        <el-option label="陌生电话" value="陌生电话"></el-option>
                        <el-option label="扫码进线" value="扫码进线"></el-option>
                        <el-option label="批量导入" value="批量导入"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="手机2" prop="mmTwoPhone">
                    <el-input type="number" v-model="personObj.mmTwoPhone" maxlength="11"></el-input>
                </el-form-item>
                <el-form-item label="学校：">
                    <el-select v-model="personObj.school" placeholder="请选择学校（可不填）">
                        <el-option v-for="item in schoolArr" :key="item" :label="item" :value="item"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="年级：">
                    <el-select v-model="personObj.grade" placeholder="请选择年级（可不填）">
                        <el-option v-for="item in grade" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="定金：">
                    <el-input v-model="personObj.du_dingjin" placeholder="请输入定金（可不填）" maxlength="4" autocomplete="off"></el-input>
                </el-form-item>
<!--                <el-form-item label="年龄：">-->
<!--                    <el-input v-model="personObj.age" placeholder="请输入年龄（可不填）" maxlength="2" autocomplete="off"></el-input>-->
<!--                </el-form-item>-->
                <el-form-item label="性别：">
                    <el-radio-group v-model="personObj.sex">
                        <el-radio border  :label="0">未知</el-radio>
                        <el-radio border  :label="1">男生</el-radio>
                        <el-radio border  :label="2">女生</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="地址：">
                    <el-input v-model="personObj.address" placeholder="请输入地址（可不填）" maxlength="30" autocomplete="off"></el-input>
                </el-form-item>
<!--                <el-form-item label="家属：">-->
<!--                    <el-input v-model="personObj.pname" placeholder="请输入家属姓名（可不填）" maxlength="12" autocomplete="off"></el-input>-->
<!--                </el-form-item>-->
                <el-form-item label="打分：">
                    <div style="padding-top:10px;">
                        <el-rate v-model="personObj.dafen" :max="5" show-score text-color="#ff9900" ></el-rate>
                    </div>
                </el-form-item>
                <el-form-item label="课本教材：" v-if="personObj.du_english!=''">
                    <div>{{personObj.du_english}}</div>
                </el-form-item>
                <el-form-item label="学习期望：" v-if="personObj.du_hopestr!=''">
                    <div>{{personObj.du_hopestr}}</div>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="addMokeDivShow = false">取 消</el-button>
                <el-button :disabled="butajaxing" type="primary" @click="addMoke()">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="添加备注" :visible.sync="remarkBoxShow" :close-on-click-modal="false" :close-on-press-escape="false" width="50%">
            <el-form ref="bbb">
                <el-input type="textarea" :rows="10" v-model="remarkTxt" placeholder="请输入备注" autocomplete="off"></el-input>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="remarkBoxShow = false">取 消</el-button>
                <el-button :disabled="butajaxing" type="primary" @click="runBeizhu">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="添加转化日志" :visible.sync="theLogBoxShow" :close-on-click-modal="false" :close-on-press-escape="false" width="70%">

            <div>
                <el-table border ref="multipleTable" tooltip-effect="dark" :data="nowROWARR" style="width: 100%">
<!--                    <el-table-column label="头像" width="120">-->
<!--                        <template slot-scope="scope">-->
<!--                            <div class="sex_00">-->
<!--                                <div><el-avatar size="medium" :src="scope.row.avatarUrl"></el-avatar></div>-->
<!--                                <div style="color:#333;font-size:12px;">-->
<!--                                    <span v-if="scope.row.dl_userid>0">{{scope.row.dl_userid}}</span>-->
<!--                                    <span v-else>未绑定</span>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </template>-->
<!--                    </el-table-column>-->
                    <el-table-column label="进线日期" header-align="center">
                        <template slot-scope="scope">
                            <div style="text-align: center;">
                                <span style="color:#f3f;font-weight:bold;font-size:20px;" v-html="getShortTime(scope.row.dl_addtime,1)">{{scope.row.dl_addtime}}</span>
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column label="姓名" header-align="center">
                        <template slot-scope="scope">
                            <div style="text-align: center;">
                                <el-badge style="margin-top:10px;" :value="getSexStr(scope.row.du_sex)" class="item" :type="getSexBtnType(scope.row.du_sex)">
                                    <div>
                                        <span style="font-weight:bold;color:#000;font-size:16px;">{{scope.row.du_truename}}</span>
                                    </div>
                                </el-badge>
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column label="电话" header-align="center">
                        <template slot-scope="scope"><div style="text-align: center;"><span style="color:#666;font-weight:bold;">{{scope.row.du_mobile}}</span></div></template>
                    </el-table-column>
                    <el-table-column label="学校" header-align="center">
                        <template slot-scope="scope"><div style="text-align: center;"><span>{{scope.row.du_school}}</span></div></template>
                    </el-table-column>
                    <el-table-column label="年级" header-align="center">
                        <template slot-scope="scope"><div style="text-align: center;"><span>{{scope.row.du_grade}}</span></div></template>
                    </el-table-column>
                </el-table>
            </div>

            <div style="padding-top:10px;">
                <el-form ref="ccc" :inline="true" :model="logFormObj" class="demo-form-inline">
                    <div style="display: flex">
                        <div style="width:120px;">
                            <el-form-item label="" >
                                <el-input v-model="logFormObj.inName" :disabled="true" placeholder="管理员姓名"></el-input>
                            </el-form-item>
                        </div>
                        <div style="width:140px;">
                            <el-form-item label="">
                                <el-select v-model="logFormObj.opmstr">
                                    <el-option label="电话沟通" value="电话沟通"></el-option>
                                    <el-option label="地推面聊" value="地推面聊"></el-option>
                                    <el-option label="微信沟通" value="微信沟通"></el-option>
                                    <el-option label="自定义备注" value="自定义备注"></el-option>
                                    <el-option label="面对面沟通" value="面对面沟通"></el-option>
                                    <el-option label="交定金沟通" value="交定金沟通"></el-option>
                                    <el-option label="退费沟通" value="退费沟通"></el-option>
                                </el-select>
                            </el-form-item>
                        </div>
                        <div style="flex:1;padding-right:10px;" id="beizhu">
                            <el-form-item label="" style="width:100%;">
                                <el-input style="width:100%;"  v-model="logFormObj.logtxt" placeholder="填写本次沟通备注"></el-input>
                            </el-form-item>
                        </div>
                        <div style="width:120px;">
                            <el-form-item label="">
                                <el-button :disabled="butajaxing" style="background:#F00;color:#FFF;" type="primary" @click="runAddLog">添加日志</el-button>
                            </el-form-item>
                        </div>
                    </div>
                </el-form>
            </div>

            <div style="padding-top:10px;font-size:16px;">
                <div v-for="(item, index) in nowZhmarkArr" style="display:flex;">
                    <div style="flex-basis: auto;">
                        <span>{{item.no}}：</span>
                    </div>
                    <div style="flex-basis: auto;">{{item.cl_adminname}}</div>
                    <div style="flex-basis: auto;color:#00F;">【{{item.cl_typestr}}】</div>
                    <div style="flex:1;">{{item.cl_logtxt}}</div>
                    <div style="flex-basis: auto;text-align:right;font-weight:bold;" v-html="getShortTime(item.cl_addtime,2)"></div>
                </div>
            </div>
<!--            <div slot="footer" class="dialog-footer">-->
<!--                <el-button @click="theLogBoxShow = false">取 消</el-button>-->
<!--                <el-button :disabled="butajaxing" type="primary" @click="runAddLog">添加日志</el-button>-->
<!--            </div>-->
        </el-dialog>

        <el-dialog title="设置下次回访" :visible.sync="backCallBoxShow" :close-on-click-modal="false" :close-on-press-escape="false" width="50%">
            <div>
                <div style="color:#F00;">设置回访客户如下：</div>
                <div style="padding:20px;display: flex; flex-wrap: wrap;justify-content: flex-start;">
                    <div style="padding-right:10px;padding-bottom:10px;" v-for="item in moveMobileArr">
                        <div><el-tag type="success">{{item}}</el-tag></div>
                    </div>
                </div>
            </div>
            <el-form ref="ddd">
                <el-form-item label="下次回访时间（清空时间表示取消回访）">
                    <el-date-picker
                            v-model="backCallNextTime"
                            type="datetime"
                            placeholder="选择日期时间"
                            format="yyyy-MM-dd HH:mm"
                            value-format="yyyy-MM-dd HH:mm">
                    </el-date-picker>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="backCallBoxShow = false">取 消</el-button>
                <el-button :disabled="butajaxing" type="primary" @click="runSetMoveOrBackCall('backcall')">设置回访 / 取消回访</el-button>
            </div>
        </el-dialog>

        <el-dialog title="设置上门试听" :visible.sync="shiTingBoxShow" :close-on-click-modal="false" :close-on-press-escape="false" width="50%">
            <div>
                <div style="color:#00F;">设置上门试听客户如下：</div>
                <div style="padding:20px;display: flex; flex-wrap: wrap;justify-content: flex-start;">
                    <div style="padding-right:10px;padding-bottom:10px;" v-for="item in moveMobileArr">
                        <div><el-tag type="success">{{item}}</el-tag></div>
                    </div>
                </div>
            </div>
            <el-form ref="eee">
                <el-form-item label="上门试听时间（清空时间表示取消试听）">
                    <el-date-picker
                            v-model="shiTingTime"
                            type="datetime"
                            placeholder="选择日期时间"
                            format="yyyy-MM-dd HH:mm"
                            value-format="yyyy-MM-dd HH:mm">
                    </el-date-picker>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="shiTingBoxShow = false">取 消</el-button>
                <el-button :disabled="butajaxing" type="success" @click="runSetMoveOrBackCall('shiting')">上门试听 / 取消试听</el-button>
            </div>
        </el-dialog>

        <el-dialog title="分配数据给沟通员" :visible.sync="fenPeiBoxShow" :close-on-click-modal="false" :close-on-press-escape="false" width="30%">
            <div>
                <div style="color:#F0F;">设置以下数据给沟通员：</div>
                <div style="padding:20px;display: flex; flex-wrap: wrap;justify-content: flex-start;">
                    <div style="padding-right:10px;padding-bottom:10px;" v-for="item in moveMobileArr">
                        <div><el-tag type="success">{{item}}</el-tag></div>
                    </div>
                </div>
            </div>
            <el-form ref="fff">
                <el-select v-model="fenpeiAdminId" filterable placeholder="选择沟通员">
                    <el-option key="0" label="取消分配" value="0"></el-option>
                    <el-option
                            v-for="item in adminArr"
                            :label="item.real_name"
                            :value="String(item.store_user_id)">
                    </el-option>
                </el-select>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="fenPeiBoxShow = false">取 消</el-button>
                <el-button :disabled="butajaxing" type="success" @click="runSetMoveOrBackCall('fenpei')">设置分配</el-button>
            </div>
        </el-dialog>

        <el-dialog title="设置状态移动" :visible.sync="flowBoxShow" :close-on-click-modal="false" :close-on-press-escape="false" width="60%">
            <div>
                <div style="color:#F00;">确定移动以下客户：</div>
                <div style="padding:20px;display: flex; flex-wrap: wrap;justify-content: flex-start;">
                    <div style="padding-right:10px;padding-bottom:10px;" v-for="item in moveMobileArr">
                        <div><el-tag type="success">{{item}}</el-tag></div>
                    </div>
                </div>
            </div>
            <el-form ref="ggg">
                <el-radio-group v-model="nowFlowInt">
                    <el-radio border  :label="0">移动到->陌客</el-radio>
                    <el-radio border v-for="(item, index) in zhuanghuaArr"  :label="index+1">移动到->{{item}}</el-radio>
<!--                    <el-radio border  :label="1">移动到->1级转化</el-radio>-->
<!--                    <el-radio border  :label="2">移动到->2级转化</el-radio>-->
<!--                    <el-radio border  :label="3">移动到->3级转化</el-radio>-->
<!--                    <el-radio border  :label="4">移动到->4级转化</el-radio>-->
<!--                    <el-radio border  :label="5">移动到->5级转化</el-radio>-->
                    <el-radio border  :label="80">移动到->已成交</el-radio>
                    <el-radio border  :label="-1">移动到->回收站</el-radio>
                </el-radio-group>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="flowBoxShow = false">取 消</el-button>
                <el-button :disabled="butajaxing" type="primary" @click="runSetMoveOrBackCall('move')">确定移动</el-button>
            </div>
        </el-dialog>
    </div>
</div>

<script>
    const validatePhone = (rule, value, callback) => {
        // 手机号码正则表达式
        const reg = /^1[3-9]\d{9}$/;
        if (reg.test(value)) {
            // 如果符合规则，则通过验证
            callback();
        } else {
            // 否则返回错误信息
            callback(new Error('手机号格式不正确'));
        }
    }
    var _theData = <?php echo json_encode($data); ?>;
    var _this = null;
    //var flowArr = ['all','back',0,1,2,3,4,5,6,80,-1];
    var flowArr = _theData.flowArr;
    console.log(_theData);
    //alert(BASE_URL+"***"+STORE_URL);
    var fullLoading = null;
    new Vue({
        el: '#dituiuser',
        data: {
            fileList:[], //批量上传数据
            tabelYS:'one',
            theLogBoxShow:false,
            logFormObj:{
              inName:_theData.adminName,
              opmstr:'电话沟通',
              logtxt:'',
            },
            nowZhmarkArr:[],
            nowROWARR:[],

            grade: [{ value: '无', label: '无' },{ value: '一年级', label: '一年级' },{ value: '二年级', label: '二年级' },{ value: '三年级', label: '三年级' },
                { value: '四年级', label: '四年级' },{ value: '五年级', label: '五年级' },{ value: '六年级', label: '六年级' },
                { value: '幼儿园小班', label: '幼儿园小班' },{ value: '幼儿园中班', label: '幼儿园中班' },{ value: '幼儿园大班', label: '幼儿园大班' },
                { value: '七年级', label: '七年级' },{ value: '八年级', label: '八年级' },{ value: '九年级', label: '九年级' },{ value: '其他', label: '其他' }],

            opmDlidArr:[],
            moveMobileArr:[],
            flowBoxShow:false,
            nowFlowInt:0,

            zhuanghuaArr: _theData.zhuanghuaArr,    //字典的数组
            sellerArr: _theData.sellerArr, //所有地推员数据
            adminArr:_theData.adminArr, //所有管理员沟通人列表
            schoolArr: _theData.schoolArr, //学校字符串数组
            zhColorArr: _theData.zhColorArr, //转化中的背景颜色
            showMyData:_theData.showMyData, //是否显示分配给自己的沟通数据
            allBigNumArr:_theData.allBigNumArr, //每个阶段的总个数

            backCallBoxShow:false,
            backCallNextTime:"",
            shiTingBoxShow:false, //试听页面弹出层
            shiTingTime:"", //试听时间
            fenPeiBoxShow:false,
            fenpeiAdminId:'',
            fenpeiAdminName:'',

            activeName: 'tab_all',    //刷新进入，此值为 tab_0，请求陌客数据 tab_all 请求全部数据
            // 搜索相关的字段
            formInline: {
                startTime: '',
                endTime: '',
                day_str:'',
                phone: '',
                school:'',
                remark: '',
                name:'',
                flowint:'',    //刷新进入，请求陌客数据，此值为 '0'，直接请求到陌客数据，此值为 '' 则请求所有数据
                xuehao:'',
                sellerId:'',
                sayadminId:'',
                channelStr:'',
                sex:'',
            },
            multipleSelection: [],  //多选框
            butajaxing:false,
            modifyTitle: '手动添加陌客',
            userModifyKey: 'add',
            // 添加和修改客户的时候使用
            personObj:{
                mmphone:"",
                mmTwoPhone:"",
                du_english:"",
                du_hopestr:"",
                mokeName: "",
                du_dingjin:"",
                sex:0,
                age:"", //年龄
                pname:"",   //家属姓名
                address:"", //地址
                school:"",
                grade:"",
                dafen:0, //数据得分
            },
            rules: {
                //<el-form-item label="手机：" prop="mmphone">，不加这个是不会成功的
                mmphone: [
                    { required: true, message: '请输入手机', trigger: 'blur' },
                    { validator: validatePhone, trigger: 'blur' },
                ],
                mmTwoPhone: [
                    { validator: validatePhone, trigger: 'blur' },
                ]
            },
            addMokeDivShow:false,
            remarkBoxShow:false,
            remarkTxt:'',
            nowdl_id:0,
            nowRowCnt:0,

            tableData: _theData.list,
            currentPage: 1,
            pageSize: SIZE30,     //PAGESIZE
            callBackNum: _theData.callBackNum,
            totalItems: _theData.allNum // 假设总共有100条记录
        },
        watch: {
            'formInline.flowint': function(newVal, oldVal) {
                console.log(newVal, oldVal);
                if (typeof newVal === 'number') {
                    this.formInline.flowint = newVal.toString();
                }
            }
        },
        mounted(){
            _this = this;
            //如果首次需要请求其他选项卡，则重新请求数据
            //alert(this.activeName)
            if(this.activeName != 'tab_all'){
                this.formInline.activeName = this.activeName;
                this.loadTableData();
            }
        },
        methods: {
            submitForm(formName) {
                var _this = this;
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        var jsonStr = JSON.stringify(_this.personObj)
                        console.log(_this.personObj, jsonStr);
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            getHeaderBg(flowId, type){
                if(type==1){
                    if(flowId==-1){
                        return 'background:#666666 !important;';
                    }
                    else if(flowId==0){
                        return 'background:#e6a23c !important;';
                    }
                    else if(flowId==80){
                        return 'background:#FF0000 !important;';
                    }
                    else{
                        return 'background:'+this.zhColorArr[flowId-1]+' !important;';
                    }
                }
                if(type==2){
                    if(flowId==-1){
                        return 'border:1px solid #666666 !important;background:#FFF !important;color:#666666 !important;';
                    }
                    else if(flowId==0){
                        return 'border:1px solid #e6a23c !important;background:#FFF !important;color:#e6a23c !important;';
                    }
                    else if(flowId==80){
                        return 'border:1px solid #FF0000 !important;background:#FFF !important;color:#FF0000 !important;';
                    }
                    else{
                        return 'border:1px solid '+this.zhColorArr[flowId-1]+' !important;background:#FFF !important;color:'+this.zhColorArr[flowId-1]+' !important;';
                    }
                }
            },
            getSexStr(sex){
                if(sex==1){
                    return '男';
                }
                else if(sex==2){
                    return '女';
                }
                else{
                    return '';
                }
            },
            getShortTime(timeStr, type){
              var arr1 = timeStr.split(' ');
              var arr2 = arr1[0].split('-');
              var arr3 = arr1[1].split(':');
              var one = arr2[1]+'-'+arr2[2];
              var two = arr3[0]+':'+arr3[1];
              if(type==1){
                  return one;
              }
              else if(type==2){
                  return one+' '+two;
              }
              else{
                  return arr2[0].slice(-2)+'/'+arr2[1]+'/'+arr2[2];
              }
            },
            getSexBtnType(sex){
                if(sex==1){
                    return 'primary';
                }
                else if(sex==2){
                    return 'danger';
                }
                else{
                    return 'info';
                }
            },
            // 选择或取消全选
            toggleSelection(rows) {
                if (rows) {
                    rows.forEach(row => {
                        this.$refs.multipleTable.toggleRowSelection(row);
                    });
                } else {
                    this.$refs.multipleTable.clearSelection();
                }
            },
            // 点击每个勾选框之后
            handleSelectionChange(val) {
                this.multipleSelection = val;
                var chooseArr = this.multipleSelection;
                this.opmDlidArr = [];
                this.moveMobileArr = [];
                for(var i=0,cnt=chooseArr.length; i<cnt; i++){
                    this.opmDlidArr.push(chooseArr[i]['dl_id']);
                    this.moveMobileArr.push(chooseArr[i]['du_mobile']);
                }
                console.log('当前选择。', chooseArr, this.opmDlidArr);
            },
            handleClick(aa) {
                this.formInline.flowint = flowArr[aa.index];
                this.search('yes');
                //console.log(aa.index);
            },
            //打开沟通日志框
            openTheLogBox(index, row){
                this.nowROWARR = [row];
                this.logFormObj.logtxt = "";
                this.nowdl_id = row.dl_id;
                this.nowRowCnt = index;
                this.opmDlidArr = [row.dl_id];
                this.moveMobileArr = [row.du_mobile];
                this.nowZhmarkArr = row.zhmarkArr;
                this.theLogBoxShow = true;
            },
            //打开备注框
            onFocusBZ(index, row){
                this.remarkTxt = row.du_zhmyremark;
                this.nowdl_id = row.dl_id;
                this.nowRowCnt = index;
            },
            onBlurBZ(index, row){
                this.remarkTxt = row.du_zhmyremark;
                this.nowdl_id = row.dl_id;
                this.nowRowCnt = index;
                this.runBeizhu();
            },
            // 打开状态设置框
            openFlowChange(index, row, kkk){
                if(row.du_flowid==80 && row.du_class!=0){
                    this.$message.error('不能移动或分配已成交已分班的用户');
                }
                else{
                    this.nowdl_id = row.dl_id;
                    this.nowRowCnt = index;
                    this.opmDlidArr = [row.dl_id];
                    this.moveMobileArr = [row.du_mobile];
                    this.nowFlowInt = row.du_flowid;
                    this.fenpeiAdminId = String(row.du_sayadmid);
                    if(kkk=='move'){this.flowBoxShow = true;}
                    if(kkk=='fenpei'){
                        if(this.showMyData>20){
                            this.fenPeiBoxShow = true;
                        }
                    }
                }
            },
            // 打开是试听设置弹出层
            openShitingBox(index, row){
                this.nowdl_id = row.dl_id;
                this.nowRowCnt = index;
                this.opmDlidArr = [row.dl_id];
                this.moveMobileArr = [row.du_mobile];
                this.shiTingTime = row.du_shiting != null ? row.du_shiting : "";
                this.shiTingBoxShow = true;
            },
            // 打开下次回访设置弹出层
            openCallBackBox(index, row){
                this.nowdl_id = row.dl_id;
                this.nowRowCnt = index;
                this.opmDlidArr = [row.dl_id];
                this.moveMobileArr = [row.du_mobile];
                this.backCallNextTime = row.du_nextcall != null ? row.du_nextcall : "";
                this.backCallBoxShow = true;
            },
            // 批量设置下次回访时间
            pibackCall(){
                var opmDlidArr = this.opmDlidArr;
                if(opmDlidArr.length==0){
                    this.$message.error('请选择要移动得数据');
                    _this.butajaxing = false;
                    return false;
                }
                this.backCallNextTime = "";
                this.nowRowCnt = 0;
                this.nowdl_id = 0;
                this.backCallBoxShow = true;
            },
            // 批量移动的初始化
            pimoveInit(kkk){
                var opmDlidArr = this.opmDlidArr;
                if(opmDlidArr.length==0){
                    this.$message.error('请选择要移动或要分配的数据');
                    _this.butajaxing = false;
                    return false;
                }
                var dataArr = this.tableData;
                for(var i=0,cnt=opmDlidArr.length; i<cnt; i++){
                    var dlID = opmDlidArr[i];
                    for(var j=0,jcnt=dataArr.length; j<jcnt; j++){
                        if(dataArr[j]['dl_id'] == dlID && dataArr[j]['du_flowid']== 80  && dataArr[j]['du_class']!=0){
                            this.$message.error('已成交已分班的数据不能移动或分配');
                            _this.butajaxing = false;
                            return false;
                            break;
                        }
                    }
                }
                this.nowFlowInt = 0;
                this.nowRowCnt = 0;
                this.nowdl_id = 0;
                this.fenpeiAdminId = '0';
                if(kkk=='move'){this.flowBoxShow = true;}
                if(kkk=='fenpei'){this.fenPeiBoxShow = true;}
            },
            // 打开添加用户框
            openAddUserBox(key, _title){
                this.modifyTitle = _title;
                this.userModifyKey = key;
                this.addMokeDivShow = true;
                this.clearAddInput();
            },
            // 打开修改框框
            openModify(key, title, index, row){
                this.userModifyKey = key;
                this.modifyTitle = title;
                this.remarkTxt = row.du_zhmyremark;
                this.nowdl_id = row.dl_id;
                this.nowRowCnt = index;
                this.personObj = {
                    mmphone:row.du_mobile,
                    avatarUrl:row.avatarUrl,
                    nickName:row.nickName,
                    dl_channel:row.dl_channel,
                    points:row.points,
                    mmTwoPhone:row.du_mobile2,
                    du_english:row.du_english,
                    du_hopestr:row.du_hopestr,
                    mokeName: row.du_truename,
                    du_dingjin:row.du_dingjin,
                    sex: row.du_sex,
                    age: row.du_age, //年龄
                    pname: row.du_ptruename,   //家属姓名
                    address: row.du_address, //地址
                    school: row.du_school,
                    grade: row.du_grade,
                    dafen: row.dl_dafen, //数据得分
                };
                this.addMokeDivShow = true;
            },
            handleEdit(index, row){
                this.remarkTxt = row.du_zhmyremark;
                this.nowdl_id = row.dl_id;
                this.nowRowCnt = index;
                this.remarkBoxShow = true;
            },
            runSetMoveOrBackCall(opmStr){
                this.butajaxing = true;
                var opmDlidArr = this.opmDlidArr;
                if(opmDlidArr.length==0){
                    this.$message.error('请选择要移动得数据');
                    _this.butajaxing = false;
                    return false;
                }
                // if(opmStr=='backcall' && this.backCallNextTime==""){
                //     this.$message.error('请选择下次回访的时间');
                //     _this.butajaxing = false;
                //     return false;
                // }
                // 设置移动，需要输入移动密码
                if(opmStr=='move' || opmStr=='fenpei'){
                    // 设置分配
                    if(opmStr=='fenpei') {
                        for (var i = 0, cnt = this.adminArr.length; i < cnt; i++) {
                            if (this.adminArr[i]['store_user_id'] == this.fenpeiAdminId) {
                                this.fenpeiAdminName = this.adminArr[i]['real_name'];
                            }
                        }
                    }
                    // 输入操作密码
                    var pwd = this.nowFlowInt==80 ? /123666/ : /123456/;
                    this.$prompt("请输入操作密码", "确定移动该数据？", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        inputPattern: pwd,
                        type: "warning",
                        inputErrorMessage: "口令错误",
                    })
                    .then(() => {
                        _this.ajaxopmMoveAndCallBack(opmStr);
                    })
                    .catch(() => {_this.butajaxing = false;});
                }
                // 设置回访不需要设置回访操作密码
                else{
                    this.ajaxopmMoveAndCallBack(opmStr)
                }
            },
            ajaxopmMoveAndCallBack(opmStr){
                $.post('/index.php?s=/store/ditui.Dtzhuanhua/flowRemove', {"opmStr":opmStr, "opmDlidArr":this.opmDlidArr, nowFlowInt:this.nowFlowInt,
                    "backCallNextTime":this.backCallNextTime, "shiTingTime":this.shiTingTime,
                    "fenpeiAdminId":this.fenpeiAdminId, "fenpeiAdminName":this.fenpeiAdminName}, function (_res) {
                    console.log('aaaaa', _res, _res.code)
                    _this.butajaxing = false;
                    _this.flowBoxShow = false;
                    _this.backCallBoxShow = false;
                    _this.shiTingBoxShow = false;
                    _this.fenPeiBoxShow = false;
                    if(_res.code==0){
                        _this.$message.error(_res.msg);
                    }
                    else{
                        _this.$message({ message: _res.data.msg, type: 'success' });
                        // 单独点击设置回访按钮，渲染数据不刷新
                        if(_this.nowdl_id>0){
                            if(opmStr=='backcall'){
                                _this.tableData[_this.nowRowCnt]['du_nextcall'] = _this.backCallNextTime;
                                _this.$set(_this.tableData, _this.nowRowCnt, _this.tableData[_this.nowRowCnt]);
                            }
                            if(opmStr=='shiting'){
                                _this.tableData[_this.nowRowCnt]['du_shiting'] = _this.shiTingTime;
                                _this.$set(_this.tableData, _this.nowRowCnt, _this.tableData[_this.nowRowCnt]);
                            }
                            if(opmStr=='move'){
                                _this.tableData[_this.nowRowCnt]['du_flowid'] = _this.nowFlowInt;
                                _this.$set(_this.tableData, _this.nowRowCnt, _this.tableData[_this.nowRowCnt]);
                            }
                            if(opmStr=='fenpei'){
                                _this.tableData[_this.nowRowCnt]['du_sayname'] = _this.fenpeiAdminName;
                                _this.$set(_this.tableData, _this.nowRowCnt, _this.tableData[_this.nowRowCnt]);
                                _this.fenpeiAdminId = ''; _this.fenpeiAdminName=='';
                            }
                        }
                        // 批量修改或移动，刷新全部数据
                        else{
                            window.location = window.location;
                        }
                        //_this.search('no');
                    }
                })
            },
            runBeizhu(){
                var newBz = $.trim(this.remarkTxt);
                if(newBz==""){
                    this.$message.error('备注不能为空，至少保留一句备注');
                }
                else{
                    this.butajaxing = true;
                    $.post('/index.php?s=/store/ditui.Dtzhuanhua/addRemark', {"nowdl_id":this.nowdl_id, "nowdl_id":this.nowdl_id, "remarkTxt": newBz}, function (_res) {
                        console.log('aaaaa', _res, _res.code)
                        _this.butajaxing = false;
                        if(_res.code==0){
                            _this.$message.error(_res.msg);
                        }
                        else{
                            _this.$message({ message: _res.data.msg, type: 'success' });
                            _this.remarkBoxShow = false
                            _this.tableData[_this.nowRowCnt]['du_zhmyremark'] = newBz;
                            _this.$set(_this.tableData, _this.nowRowCnt, _this.tableData[_this.nowRowCnt]);
                        }
                    })
                }
            },
            runAddLog(){
                var logtxt = $.trim(this.logFormObj.logtxt);
                if(logtxt==""){
                    this.$message.error('日志备注不能为空，至少保留一句备注');
                }
                else {
                    this.butajaxing = true;
                    $.post('/index.php?s=/store/ditui.Dtzhuanhua/addcalllog', {"nowdl_id":this.nowdl_id, "logFormObj":this.logFormObj}, function (_res) {
                        console.log('aaaaa', _res, _res.code)
                        _this.butajaxing = false;
                        if(_res.code==0){
                            _this.$message.error(_res.msg);
                        }
                        else{
                            _this.$message({ message: _res.data.msg, type: 'success' });
                            _this.theLogBoxShow = false
                            _this.tableData[_this.nowRowCnt]['zhmarkArr'] = _res.data.newLogListArr;
                            _this.$set(_this.tableData, _this.nowRowCnt, _this.tableData[_this.nowRowCnt]);
                        }
                    })
                }
            },
            addMoke(){
                var _this = this;
                var _mmphone = $.trim(this.personObj.mmphone);
                var _mokeName = $.trim(this.personObj.mokeName);
                if(_mmphone==''){
                    //this.$alert('请输入地推员ID号');
                    this.$message.error('请输入陌客手机号');
                }
                else{
                    const phoneRegex = /^1[3-9]\d{9}$/;
                    if(!(phoneRegex.test(_mmphone))){
                        this.$message.error('手机号码错误');
                    }
                    else{
                        this.butajaxing = true;
                        $.post('/index.php?s=/store/ditui.Dtzhuanhua/addmoke', {"key":this.userModifyKey, "nowdl_id":this.nowdl_id, "personObj":this.personObj}, function (_res) {
                            console.log('aaaaa', _res, _res.code)
                            _this.butajaxing = false;
                            if(_res.code==0){
                                _this.$message.error(_res.msg);
                            }
                            else{
                                _this.$message({
                                    message: _res.data.msg,
                                    type: 'success'
                                });
                                // 如果是手动添加，则直接刷新页面
                                if(_this.userModifyKey=='add'){
                                    window.location = window.location;
                                }
                                // 如果是修改，则重新渲染数据，重新获取地推人员列表，换成跟新表
                                else{
                                    _this.tableData[_this.nowRowCnt]['du_mobile'] = _this.personObj.mmphone;
                                    _this.tableData[_this.nowRowCnt]['du_mobile2'] = _this.personObj.mmTwoPhone;
                                    _this.tableData[_this.nowRowCnt]['du_english'] = _this.personObj.du_english;
                                    _this.tableData[_this.nowRowCnt]['du_hopestr'] = _this.personObj.du_hopestr;
                                    _this.tableData[_this.nowRowCnt]['du_truename'] = _this.personObj.mokeName;
                                    _this.tableData[_this.nowRowCnt]['du_dingjin'] = _this.personObj.du_dingjin;
                                    _this.tableData[_this.nowRowCnt]['du_sex'] = _this.personObj.sex;
                                    _this.tableData[_this.nowRowCnt]['du_age'] = _this.personObj.age;
                                    _this.tableData[_this.nowRowCnt]['du_ptruename'] = _this.personObj.pname;
                                    _this.tableData[_this.nowRowCnt]['du_address'] = _this.personObj.address;
                                    _this.tableData[_this.nowRowCnt]['du_school'] = _this.personObj.school;
                                    _this.tableData[_this.nowRowCnt]['du_grade'] = _this.personObj.grade;
                                    _this.tableData[_this.nowRowCnt]['dl_dafen'] = _this.personObj.dafen;
                                    _this.tableData[_this.nowRowCnt]['dl_channel'] = _this.personObj.dl_channel;
                                    _this.$set(_this.tableData, _this.nowRowCnt, _this.tableData[_this.nowRowCnt]);
                                }
                                //清空input框
                                _this.clearAddInput();
                                _this.addMokeDivShow = false;
                            }
                        })
                    }
                }
            },
            clearAddInput(){
                this.personObj = {
                    mmphone:"",
                    mmTwoPhone:"",
                    du_english:"",
                    du_hopestr:"",
                    mokeName: "",
                    du_dingjin:"",
                    sex:0,
                    age:"",
                    pname:"",
                    address:"",
                    school:"",
                    grade:"",
                    dafen:0,
                };
            },
            search(key) {
                // 这里应该添加逻辑来过滤数据
                // console.log('搜索:', this.formInline);
                if(key=="no" || key=='today' || key=='yesterday'){
                    this.activeName = 'tab_all';
                    this.formInline = {
                        activeName: 'tab_all',
                        startTime: '',
                        endTime: '',
                        day_str: key=="no" ? '' : key,
                        phone: '',
                        school:'',
                        remark: '',
                        name:'',
                        flowint:'',
                        xuehao:'',
                        sellerId:'',
                        sayadminId:'',
                        channelStr:'',
                        sex:''
                    };
                }
                //点击搜索按钮，格式化table样式
                this.activeName = 'tab_'+this.formInline.flowint;
                this.formInline.activeName = 'tab_'+this.formInline.flowint;
                if(this.formInline.flowint == ''){
                    this.activeName = 'tab_all';
                    this.formInline.activeName = 'tab_all';
                }
                if(this.formInline.flowint == '0'){
                    this.activeName = 'tab_0';
                    this.formInline.activeName = 'tab_0';
                }
                if(this.formInline.flowint == '-1'){
                    this.activeName = 'tab_del';
                    this.formInline.activeName = 'tab_del';
                }
                // this.formInline['activeName'] = 'tab_all';
                // this.$forceUpdate(); // 强制更新组件
                this.currentPage = 1;
                this.loadTableData();
            },
            handleCurrentChange(val) {
                this.currentPage = val;
                // 更新当前页码后，重新加载数据
                this.loadTableData();
            },
            loadTableData() {
                $.post('/index.php?s=/store/ditui.Dtzhuanhua/zhuanhua', {"isAjax":"yes",
                    "currentPage":this.currentPage, "pageSize": this.pageSize,
                    "formInline":this.formInline}, function (_res) {
                    _this.tableData = _res.data.list;
                    _this.totalItems = _res.data.allNum;
                    _this.callBackNum = _res.data.callBackNum;

                    _this.butajaxing = false;
                    if(_res.data.begTimeStr!=''){
                        _this.formInline.startTime = _res.data.begTimeStr;
                    }
                    if(_res.data.endTimeStr!=''){
                        _this.formInline.endTime = _res.data.endTimeStr;
                    }
                })
            },
            beforeUpload(file) {
                fullLoading = this.$loading({
                    lock: true,
                    text: 'Loading',
                    spinner: 'el-icon-loading',
                    background: 'rgba(0, 0, 0, 0.7)'
                });

                var back = true;
                console.log(file);
                if(file.name.indexOf('pldr_moke')<0){
                    this.$message.error('请将数据写入模板文件中，再导入模板文件，名称必需一样');
                    back = false;
                }
                else{
                    const isLt2M = file.size / 1024 / 1024 < 2;
                    if (!isLt2M) {
                        this.$message.error('文件大小不能超过 2MB!');
                        back = false;
                    }
                }
                if(back==false){
                    if(fullLoading!=null){
                        fullLoading.close();
                    }
                }
                return back;
            },
            chooceFileOk(response, file, fileList) {
                console.log(response);
                fullLoading.close();
                if(response.code==1){
                    this.$message.success('批量上传成功');
                    window.location = window.location;
                }
                else{
                    this.$message.error('批量上传失败');
                }
                // if(this.beforeUpload(file)){
                //     var resData = response.data;
                //     this.fileList = fileList;
                //     console.log(this.fileList);
                // }
            }
        }
    });
</script>